<template>
	<view class="info">
		<u-navbar :autoBack="true" leftIconColor="#fff" title="个人信息" :bgColor="theme == 'light' ? '#0071ff' : '#2c2c2c'"
			:safeAreaInsetTop="true" :placeholder="true" titleStyle="color:#fff">
		</u-navbar>
		<u--form labelPosition="left" :model="userInfo" ref="uForm" labelWidth="auto">
			<u-cell-group>
				<u-cell icon="" isLink title="昵称" :value="userInfo.nickname"></u-cell>
				<u-cell icon="" isLink title="手机号" :value="userInfo.phone"></u-cell>
				<u-cell icon="" isLink title="邀请码" :value="userInfo.invitationCode"></u-cell>
			</u-cell-group>

		</u--form>

		<view class="buttom">
			<button type="primary" @tap="exit">退出登录</button>
		</view>

		<u-modal :show="show" title="是否确认退出登录" :showCancelButton="true" @confirm="confirm"
			@cancel="show = false"></u-modal>

	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex'
	export default {
		data() {
			return {
				userInfo: uni.getStorageSync('userInfo') || {},
				show: false,
			}
		},
		methods: {
			exit() {
				this.show = true
			},
			async confirm() {
				const {
					data
				} = await uni.$u.http.post("/user/logout");
				uni.removeStorageSync('appToken')
				uni.removeStorageSync('userInfo')
				this.show = false
				this.userInfo = {}
				uni.navigateTo({
					url: "/pages/login/index",
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.info {
		padding:0rpx 10rpx;

		.buttom {
			margin-top: 20rpx;
		}
	}
</style>